<template>
	<view>
		<view class="text-center">
			<image class="cu-avatar xl round margin-top" src="/src/static/logo.png" mode=""></image>
			<view class="margin text-xl">
				创建新账号
			</view>
			<view class="">
				在此处创建您的账户
			</view>
		</view>
		<view class="padding-lr margin-lr">
			<view class="margin-tb">
				账号
			</view>
			<custom-input v-model="username" holder="请输入账号">
				<text class="iconfont icon-wode"></text>
			</custom-input>
		</view>
		<view class="padding-lr margin-lr">
			<view class="margin-tb">
				密码
			</view>
			<custom-input v-model="password" holder="请输入密码" type="password">
				<text class="iconfont icon-mima"></text>
			</custom-input>
		</view>
		<view class="padding margin-top">
			<button class="cu-btn bg-orange block " @click="handelRegister">注册</button>
		</view>
	</view>
</template>

<script setup lang="ts">
import type{ Ref } from 'vue';
import { ref} from 'vue';
import {userRegister} from '@/api/user'
const username:Ref<string> = ref('')
const password:Ref<string> = ref('')
interface ErrType{
	data?:{
		code:number,
		error:string
	}
}
const handelRegister = async()=>{
	// console.log(username.value,password.value);
	let title = '注册成功'
	try{
		let res = await userRegister(username.value,password.value)
		console.log('注册成功',res);
		uni.navigateBack({delta:1})

	}catch(err){
		console.log('注册失败',err);
		title = (err as ErrType).data!.error
	}
	uni.showToast({
		title,
		icon:'none'
	})
}
</script>

<style lang="scss">
page{
	background-color: white;
	image{
		width: 200upx;
		height: 200upx;
	}
}
</style>
